<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录页面</title>
    <script src="/webjars/jquery/3.5.1/jquery.js"></script>
</head>
<script>
    $(function () {
        $("#login").click(function () {
            $.ajax({
                url:"/doLogin",
                type:"POST",
                dataType: "json",//预期服务器返回的数据类型
                data:$("#loginForm").serializeArray(),
                success:function (result) {
                    if(result.code == 200){
                        alert("登录成功，马上跳转！")
                        window.location.href="/hello"
                    }else{
                        alert(result.msg)
                    }
                }
            })
            return false;
        })
    })
</script>
<body>
    <form action="/doLogin" method="post" id="loginForm">
        <table>
            <tr>
                <td>用户名</td>
                <td><input type="text" placeholder="请输入用户名" name="username"></td>
            </tr>
            <tr>
                <td>密码</td>
                <td><input type="password" placeholder="请输入密码" name="password"></td>
            </tr>
            <tr>
                <td>验证码</td>
                <td><input type="text" placeholder="验证码" name="code"></td>
            </tr>
            <tr>
                <td colspan="2">
                    <img src="/verify_code"  alt="验证码">
                </td>
            </tr>
            <tr>
                <td></td>
                <td><button type="submit" id="login">登   录 </button></td>
            </tr>
        </table>
    </form>
</body>

</html>